<template>
  <!--  申请-->
  <view v-if="index === 0">
    <HeaderNavTabarVue
      :iconFont="'icon-cuowuguanbiquxiao'"
      title="发起申请"
      @rightIcon="rightIcon"
    />
    <view class="topClass">
      <uni-search-bar
        v-model="searchValue"
        cancelButton="none"
        class="searchBar"
        clearButton="auto"
        placeholder="请输入申请名称"
        radius="8rpx"
        @input="search"
      />
      <uni-segmented-control
        :current="current"
        :values="items1"
        active-color="#165DFF"
        class="segment"
        in-active-color="#4E5969"
        style-type="text"
        @clickItem="onClickItem"
      />
    </view>
    <view v-if="tabbarData[current].length === 0" class="uv-empty">
      <uv-empty icon="../../static/images/empty.png" mode="list"></uv-empty>
    </view>
    <scroll-view
      v-else
      :style="`height: calc(100vh - ${
        getTitleBarHeight() * 2
      }rpx - 120rpx - 56rpx - 96rpx - 64rpx)`"
      class="scroll-Y"
      scroll-y="true"
    >
      <view v-for="item in tabbarData[current]" :key="current" class="listTabbar">
        <h4>{{ item.typeList }}</h4>
        <view
          v-for="(item1, i1) in item.children"
          :key="i1"
          class="list-item"
          @tap="handleClick(item1)"
        >
          <view :class="item.typeList + 'image'" class="svg-image">
            <image :src="item1.url" />
          </view>
          <view>
            <p>{{ item1.title }}</p>
            <text
              >{{ item1.txt }}
              <text v-show="item1.title === '补卡'">已使用{{ frequency }}次</text>
            </text>
          </view>
        </view>
      </view>
    </scroll-view>
  </view>
  <!--  审核-->
  <view v-if="index === 1">
    <HeaderNavTabarVue
      :iconFont="'icon-cuowuguanbiquxiao'"
      title="审核中心"
      @rightIcon="rightIcon"
    />
    <view class="topClass">
      <uni-search-bar
        v-model="searchValue"
        cancelButton="none"
        class="searchBar"
        clearButton="auto"
        placeholder="请输入申请名称"
        radius="8rpx"
        @input="searchPerson"
      />
      <uni-segmented-control
        :current="current"
        :isBadeg="true"
        :values="items2"
        active-color="#165DFF"
        class="segment"
        in-active-color="#4E5969"
        style-type="text"
        @clickItem="onClickItem"
      />
    </view>
    <view>
      <zb-dropdown-menu style="width: 100%; height: 92rpx">
        <zb-dropdown-item
          v-model="value1"
          :duihaoFlag="false"
          :options="option"
          name="first"
          @change="change1"
        ></zb-dropdown-item>
        <zb-dropdown-item
          v-model="value2"
          :options="option2"
          name="two"
          @change="change2"
        ></zb-dropdown-item>
      </zb-dropdown-menu>
    </view>
    <view v-if="cardDataList.length === 0" class="uv-empty" style="z-index: 0">
      <uv-empty :text="emptyText" icon="../../static/images/empty.png"></uv-empty>
    </view>
    <scroll-view
      v-else
      :lower-threshold="50"
      :style="`height: calc(100vh - ${
        getTitleBarHeight() * 2
      }rpx - 120rpx - 56rpx - 92rpx - 96rpx  - 64rpx)`"
      class="scroll-Y"
      scroll-y="true"
      @scrolltolower="scrolltolower"
    >
      <template v-for="(item, index) in cardDataList" :key="index">
        <AuditCard
          :itemProps="item"
          :show-tag="true"
          :typeShenPi="typeShenPi"
          @tap="gotoDetailPage(item)"
          @updatedCard="updatedCard"
        />
      </template>
    </scroll-view>
  </view>
  <uv-tabbar v-show="showBottonNaviBar" :value="index" activeColor="#165DFF" @change="tabChange">
    <uv-tabbar-item text="发起申请">
      <template v-slot:inactive-icon>
        <image
          class="icon"
          src="@/static/icon/faqi.svg"
          style="width: 40rpx; height: 40rpx"
        ></image>
      </template>
      <template v-slot:active-icon>
        <image
          class="icon"
          src="@/static/icon/faqi-active.svg"
          style="width: 40rpx; height: 40rpx"
        ></image>
      </template>
    </uv-tabbar-item>
    <uv-tabbar-item text="审核中心">
      <template v-slot:inactive-icon>
        <image
          class="icon"
          src="@/static/icon/stamp.svg"
          style="width: 40rpx; height: 40rpx"
        ></image>
      </template>
      <template v-slot:active-icon>
        <image
          class="icon"
          src="@/static/icon/stamp-active.svg"
          style="width: 40rpx; height: 40rpx"
        ></image>
      </template>
    </uv-tabbar-item>
  </uv-tabbar>
  <view v-show="statusLoding" class="animbox-scroll-loading">
    <view></view>
    <view></view>
    <view></view>
    <view></view>
    <view></view>
  </view>
</template>

<script setup>
import { onLoad, onPullDownRefresh, onShow } from '@dcloudio/uni-app'
import { defineProps, ref } from 'vue'
import HeaderNavTabarVue from '@/components/HeaderNavTabar/HeaderNavTabar.vue'
import timeSvg from '@/static/icon/auditSVG/timeAudit.svg'
import calendaSvg from '@/static/icon/auditSVG/calendaAudit.svg'
import computerSvg from '@/static/icon/auditSVG/computerAudit.svg'
import suitcaseSvg from '@/static/icon/auditSVG/suitcaseAudit.svg'
import { getTitleBarHeight } from '@/utils/system.js'
import AuditCard from '@/components/audit/AuditCard.vue'
import jingyingSvg from '@/static/icon/auditSVG/jingyingSvg.svg'
import feijingyingSvg from '@/static/icon/auditSVG/feijingyingSvg.svg'
import beiyongjinSvg from '@/static/icon/auditSVG/beiyongjin.svg'
import wenlvyySvg from '@/static/icon/auditSVG/wenlvyySvg.svg'
import yewuzhaodaiSvg from '@/static/icon/auditSVG/yewuzhaodaiSvg.svg'
import caigoushenqingSvg from '@/static/icon/auditSVG/caigoushenqingSvg.svg'
import huopindizhangSvg from '@/static/icon/auditSVG/huopindizhangSvg.svg'
import xiangmuzijinSvg from '@/static/icon/auditSVG/xiangmuzijinSvg.svg'
import ruzhishenqingSvg from '@/static/icon/auditSVG/ruzhishenqingSvg.svg'
import zhuanzhengSvg from '@/static/icon/auditSVG/zhuanzhengSvg.svg'
import lizhiSvg from '@/static/icon/auditSVG/lizhiSvg.svg'
import wupinSvg from '@/static/icon/auditSVG/wupinSvg.svg'
import yongzhangSvg from '@/static/icon/auditSVG/yongzhangSvg.svg'
import weixiuSvg from '@/static/icon/auditSVG/weixiuSvg.svg'
import yongcheSvg from '@/static/icon/auditSVG/yongcheSvg.svg'
import hetongSvg from '@/static/icon/auditSVG/hetongSvg.svg'
import gudingSvg from '@/static/icon/auditSVG/gudingSvg.svg'
import huiyishiSvg from '@/static/icon/auditSVG/huiyishiSvg.svg'
import gongwenSvg from '@/static/icon/auditSVG/gongwenSvg.svg'
import {
  getAttendanceApplyApi,
  getSelectApproveCount,
  getSelectApproveList,
} from '@/api/attendance'
import { getUserProfile } from '@/api/system/user'
import { findNewElements } from '@/utils/NumberBadges'

const emptyText = ref('数据请求中...')
const showBottonNaviBar = ref(true)
const removeBottomNaviBar = (val) => {
  showBottonNaviBar.value = val
}
const props = defineProps(['id'])
const frequency = ref(0)
const tabbarData = ref([
  // 考勤
  [
    {
      typeList: '考勤',
      children: [
        {
          url: timeSvg,
          title: '补卡',
          txt: '发起补卡申请，每月 3 次',
        },
        {
          url: calendaSvg,
          title: '请假',
          txt: '发起各类请假、调休申请',
        },
        {
          url: computerSvg,
          title: '加班',
          txt: '发起加班申请',
        },
        // {
        //   url: doorSvg,
        //   title: '外出',
        //   txt: '发起外出申请',
        // },
        {
          url: suitcaseSvg,
          title: '出差',
          txt: '国内出差申请',
        },
      ],
    },
  ],
  // 财务
  [
    {
      typeList: '财务',
      children: [
        {
          url: jingyingSvg,
          title: '经营性付款申请',
          txt: '日常经营活动中，需要对外支付款项',
        },
        {
          url: feijingyingSvg,
          title: '非经营性付款申请',
          txt: '非日常经营活动中，需要对外支付款项',
        },
        {
          url: beiyongjinSvg,
          title: '备用金申请',
          txt: '根据实际需要发起备用金申请',
        },
        {
          url: wenlvyySvg,
          title: '文旅运营申请',
          txt: '文旅运营专项付款申请',
        },
        {
          url: yewuzhaodaiSvg,
          title: '业务招待报备申请',
          txt: '发起业务招待报备申请',
        },
        {
          url: caigoushenqingSvg,
          title: '采购申请',
          txt: '发起采购申请',
        },
        {
          url: huopindizhangSvg,
          title: '货品抵账申请',
          txt: '发起货品抵账申请',
        },
        {
          url: xiangmuzijinSvg,
          title: '项目资金众筹申请',
          txt: '发起项目资金众筹申请',
        },
      ],
    },
  ],
  // 人事
  [
    {
      typeList: '人事',
      children: [
        {
          url: ruzhishenqingSvg,
          title: '入职申请',
          txt: '发起入职申请',
        },
        {
          url: zhuanzhengSvg,
          title: '转正申请',
          txt: '发起转正申请',
        },
        // {
        //   url: shigangSvg,
        //   title: '试岗报备',
        //   txt: '发起试岗报备',
        // },
        {
          url: lizhiSvg,
          title: '离职',
          txt: '发起离职',
        },
      ],
    },
  ],
  // 行政
  [
    {
      typeList: '行政',
      children: [
        {
          url: wupinSvg,
          title: '物品领用申请',
          txt: '发起物品领用申请',
        },
        {
          url: yongzhangSvg,
          title: '用章用印申请',
          txt: '发起用章用印申请',
        },
        {
          url: weixiuSvg,
          title: '维修申请',
          txt: '发起维修申请',
        },
        {
          url: yongcheSvg,
          title: '用车申请',
          txt: '发起用车申请',
        },
        {
          url: hetongSvg,
          title: '合同流转',
          txt: '发起合同流转',
        },
        {
          url: gudingSvg,
          title: '固定资产报废申请',
          txt: '发起固定资产报废申请',
        },
        {
          url: huiyishiSvg,
          title: '会议室预订',
          txt: '发起会议室预订',
        },
        {
          url: gongwenSvg,
          title: '公文流转',
          txt: '发起公文流转',
        },
      ],
    },
  ],
  // 其他
  // [
  //   {
  //     typeList: '其他',
  //     children: [
  //       {
  //         url: linshigongSvg,
  //         title: '临时工人申请',
  //         txt: '发起临时工人申请',
  //       },
  //       {
  //         url: peixunhuiyiSvg,
  //         title: '培训会议请假单',
  //         txt: '发起培训会议请假单',
  //       },
  //     ],
  //   },
  // ],
])
const copyData = tabbarData.value
const searchValue = ref(null)
const index = ref(0)
let pageNum = ref(1)
let pageSize = ref(10)
let totals = ref(888)
let statusLoding = ref(false)
const tabChange = (e) => {
  index.value = e
}

let value1 = ref('全部审批')
let value2 = ref('最新到达优先')
let option = ref([
  {
    text: '全部审批',
    value: '全部审批',
  },
])
let option2 = ref([
  {
    text: '最新到达优先',
    value: '最新到达优先',
  },
  {
    text: '最久等待优先',
    value: '最久等待优先',
  },
])

//顶部分段器
const items1 = ref(['考勤', '财务', '人事', '行政'])
const items2 = ref([
  {
    num: 0,
    title: '待办',
  },
  {
    num: 0,
    title: '已办',
  },
  {
    num: 0,
    title: '抄送我',
  },
  {
    num: 0,
    title: '已发起',
  },
])
const current = ref(0)

const search = (v) => {
  if (v) {
    tabbarData.value[current.value][0].children = copyData[current.value][0].children.filter(
      (item) => {
        if (item.title.includes(v)) {
          return item
        }
      },
    )
  } else {
    tabbarData.value = JSON.parse(JSON.stringify(copyData))
  }
}

const rightIcon = () => {
  uni.switchTab({
    url: '/pages/work/index',
  })
  typeChange()
}
const leftParams = ref('全部审批')
const rightParams = ref('最新到达优先')
const typeShenPi = ref('待办')
// 全部书
const getSelectApproveCountFn = async () => {
  let params = {
    status: typeShenPi.value,
  }
  let { code, data } = await getSelectApproveCount(params)

  if (code === 200) {
    option.value = data.map((v) => {
      return {
        text: v.type,
        value: v.type,
        count: v.count,
      }
    })
    option.value.unshift({
      text: '全部审批',
      value: '全部审批',
      count: data.reduce((pre, cur) => {
        return Number(pre) + Number(cur.count)
      }, 0),
    })
  }
}

const updatedCard = async () => {
  await typeChange()
}

const handleClick = (item) => {
  switch (item.title) {
    case '补卡':
      if (frequency.value < 4) {
        uni.navigateTo({
          url: '/pages/audit/attendance/replacementCard',
        })
      } else {
        uni.showToast({
          title: '您本月的补卡次数上限！',
          icon: 'none',
        })
      }
      break
    case '请假':
      uni.navigateTo({
        url: '/pages/audit/attendance/leave',
      })
      break
    case '加班':
      uni.navigateTo({
        url: '/pages/audit/attendance/WorkOvertime',
      })
      break
    case '外出':
      uni.navigateTo({
        url: '/pages/audit/attendance/GoingOut',
      })
      break
    case '出差':
      uni.navigateTo({
        url: '/pages/audit/attendance/BusinessTrip',
      })
      break

    case '经营性付款申请':
      uni.navigateTo({
        url: '/pages/audit/finance/OperatingPayments',
      })
      break

    case '非经营性付款申请':
      uni.navigateTo({
        url: '/pages/audit/finance/NotOperatingPayments',
      })
      break
    case '备用金申请':
      uni.navigateTo({
        url: '/pages/audit/finance/reserves',
      })
      break
    case '文旅运营申请':
      uni.navigateTo({
        url: '/pages/audit/finance/CulturalTourism',
      })
      break
    case '业务招待报备申请':
      uni.navigateTo({
        url: '/pages/audit/finance/BusinessHospitality',
      })
      break
    case '采购申请':
      uni.navigateTo({
        url: '/pages/audit/finance/purchaseApply',
      })
      break
    case '货品抵账申请':
      uni.navigateTo({
        url: '/pages/audit/finance/goodsOffset',
      })
      break
    case '项目资金众筹申请':
      uni.navigateTo({
        url: '/pages/audit/finance/crowdFunding',
      })
      break
    case '转正申请':
      uni.navigateTo({
        url: '/pages/audit/finance/TurnFormalApproval',
      })
      break
    // case '试岗报备':
    //   uni.navigateTo({
    //     url: '/pages/kongbai',
    //   })
    //   break
    case '物品领用申请':
      uni.navigateTo({
        url: '/pages/audit/finance/dimission',
      })
      break
    case '离职':
      uni.navigateTo({
        url: '/pages/audit/finance/Resign',
      })
      break
    case '用章用印申请':
      uni.navigateTo({
        url: '/pages/audit/finance/WithSeal',
      })
      break
    case '维修申请':
      uni.navigateTo({
        url: '/pages/audit/finance/repair',
      })
      break
    case '用车申请':
      uni.navigateTo({
        url: '/pages/audit/finance/UseCar',
      })
      break
    case '合同流转':
      uni.navigateTo({
        url: '/pages/audit/finance/ContractCirculation',
      })
      break
    case '固定资产报废申请':
      uni.navigateTo({
        url: '/pages/audit/finance/FixedAssetScrapping',
      })
      break
    case '会议室预订':
      uni.navigateTo({
        url: '/pages/audit/finance/MeetingRoomReservation',
      })
      break
    case '公文流转':
      uni.navigateTo({
        url: '/pages/audit/finance/OfficialDocuments',
      })
      break
    case '临时工人申请':
      uni.navigateTo({
        url: '/pages/audit/others/temporaryWorker',
      })
      break
    case '培训会议请假单':
      uni.navigateTo({
        url: '/pages/audit/others/leaveTrainingMeeting',
      })
      break

    case '入职申请':
      uni.navigateTo({
        url: '/pages/audit/finance/onboardingApplications',
      })
      break
  }
}

const onClickItem = (v) => {
  current.value = v.currentIndex
  if (index.value === 0) {
    search(searchValue.value)
  }
  if (index.value === 1) {
    switch (v.currentIndex) {
      case 0:
        value1.value = '全部审批'
        value2.value = '最新到达优先'
        option.value = [
          {
            text: '全部审批',
            value: '全部审批',
          },
          {
            text: '请假',
            value: '请假',
          },
          {
            text: '补卡',
            value: '补卡',
          },
          {
            text: '加班',
            value: '加班',
          },
          {
            text: '外出',
            value: '外出',
          },
          {
            text: '出差',
            value: '出差',
          },
        ]
        option2.value = [
          {
            text: '最新到达优先',
            value: '最新到达优先',
          },
          {
            text: '最久等待优先',
            value: '最久等待优先',
          },
        ]
        leftParams.value = '全部审批'
        rightParams.value = '最新到达优先'
        typeShenPi.value = '待办'
        typeChange()
        getSelectApproveCountFn()

        break
      case 1:
        value1.value = '全部审批'
        value2.value = '最新处理优先'
        option.value = [
          {
            text: '全部审批',
            value: '全部审批',
          },
        ]
        option2.value = [
          {
            text: '最新处理优先',
            value: '最新处理优先',
          },
          {
            text: '最早处理优先',
            value: '最早处理优先',
          },
        ]
        leftParams.value = '全部审批'
        rightParams.value = '最新处理优先'
        typeShenPi.value = '已办'
        typeChange()
        getSelectApproveCountFn()

        break
      case 2:
        value1.value = '全部审批'
        value2.value = '最新处理优先'
        option.value = [
          {
            text: '全部审批',
            value: '全部审批',
          },
          {
            text: '请假',
            value: '请假',
          },
          {
            text: '补卡',
            value: '补卡',
          },
          {
            text: '加班',
            value: '加班',
          },
          {
            text: '外出',
            value: '外出',
          },
          {
            text: '出差',
            value: '出差',
          },
        ]
        option2.value = [
          {
            text: '最新处理优先',
            value: '最新处理优先',
          },
          {
            text: '最早处理优先',
            value: '最早处理优先',
          },
        ]
        leftParams.value = '全部审批'
        rightParams.value = '最新处理优先'
        typeShenPi.value = '抄送我'
        typeChange()
        getSelectApproveCountFn()

        break
      case 3:
        value1.value = '全部审批'
        value2.value = '全部状态'
        option.value = [
          {
            text: '全部审批',
            value: '全部审批',
          },
        ]
        option2.value = [
          {
            text: '全部状态',
            value: '全部状态',
          },
          {
            text: '审批中',
            value: '审批中',
          },
          {
            text: '已通过',
            value: '已通过',
          },
          {
            text: '已拒绝',
            value: '已拒绝',
          },
          {
            text: '已撤回',
            value: '已撤回',
          },
        ]
        leftParams.value = '全部审批'
        rightParams.value = '全部状态'
        typeShenPi.value = '已发起'
        typeChange()
        getSelectApproveCountFn()
        break

      default:
        break
    }
  }
}
const cardDataList = ref([])
const change1 = (v) => {
  leftParams.value = v.text
  typeChange()
}
const change2 = (v) => {
  rightParams.value = v.text
  typeChange()
}
const profile = ref(null)

const gotoDetailPage = (item) => {
  switch (item.appType) {
    case '考勤':
      uni.navigateTo({
        url: `/pages/audit/auditDetails?type=${item.appType}&id=${item.id}&shengpiFlag=${
          item.applyStatus === '审核中' &&
          item.userId !== profile.value.userId &&
          typeShenPi.value === '待办'
        }`,
      })
      break
    case '财务':
      uni.navigateTo({
        url: `/pages/audit/auditDetails?type=${item.appType}&id=${item.id}&shengpiFlag=${
          item.applyStatus === '审核中' &&
          item.userId !== profile.value.userId &&
          typeShenPi.value === '待办'
        }`,
      })
      break
    case '人事':
      uni.navigateTo({
        url: `/pages/audit/auditDetails?type=${item.appType}&id=${item.id}&shengpiFlag=${
          item.applyStatus === '审核中' &&
          item.userId !== profile.value.userId &&
          typeShenPi.value === '待办'
        }`,
      })
      break
    case '行政':
      uni.navigateTo({
        url: `/pages/audit/auditDetails?type=${item.appType}&id=${item.id}&shengpiFlag=${
          item.applyStatus === '审核中' &&
          item.userId !== profile.value.userId &&
          typeShenPi.value === '待办'
        }`,
      })
      break
    case '其他':
      break
  }
}
const getSelectApproveListFn = async () => {
  let res = await getSelectApproveList({
    status: '待办',
    pageNum: 1,
    pageSize: 10000,
  })
  let res1 = await getSelectApproveList({
    status: '抄送我',
    pageNum: 1,
    pageSize: 10000,
  })

  if (res.code === 200 && res1.code === 200) {
    // 新数据
    const daibanShu = res.rows.map((v) => v.id)
    const chaosongwoShu = res1.rows.map((v) => v.id)
    // 旧数据
    const num1 = uni.getStorageSync('daibanShu', daibanShu)
      ? uni.getStorageSync('daibanShu', daibanShu).map((v) => v.id)
      : []
    const num2 = uni.getStorageSync('chaosongwoShu', chaosongwoShu)
      ? uni.getStorageSync('chaosongwoShu', chaosongwoShu).map((v) => v.id)
      : []

    if (num1.length > 0) {
      const countArr = findNewElements(daibanShu, num1)
      items2.value[0].num = countArr.length
    } else {
      items2.value[0].num = daibanShu.length
    }
    if (num2.length > 0) {
      const countArr1 = findNewElements(chaosongwoShu, num2)
      items2.value[2].num = countArr1.length
    } else {
      items2.value[2].num = chaosongwoShu.length
    }
  }
}

// 分页接口对接
const typeChange = async (flag) => {
  // 调取筛选
  let params = {
    type: leftParams.value === '全部审批' ? null : leftParams.value,
    status: typeShenPi.value,
    pageNum: pageNum.value,
    pageSize: pageSize.value,
  }
  let { rows, code, total } = await getSelectApproveList(params)
  try {
    if (code === 200) {
      if (statusLoding.value) {
        statusLoding.value = false //加载中状态
      }
      if (flag) {
        cardDataList.value = [...cardDataList.value, ...rows]
      } else {
        cardDataList.value = rows
      }
      if (params.status === '待办') {
        uni.setStorageSync('daibanShu', cardDataList.value)
        await getSelectApproveListFn()
      } else if (params.status === '抄送我') {
        uni.setStorageSync('chaosongwoShu', cardDataList.value)
        await getSelectApproveListFn()
      }
      totals.value = total

      if (cardDataList.value.length === 0) {
        emptyText.value = '列表为空'
      }
    }
  } catch {}
}

const scrolltolower = async () => {
  statusLoding.value = true //加载完状态
  let allTotal = pageNum.value * pageSize.value
  if (allTotal < totals.value) {
    pageNum.value++
    typeChange(true)
  } else {
    uni.showToast({
      title: '数据加载完毕',
    })
    statusLoding.value = false
  }
}

onPullDownRefresh(async () => {
  pageNum.value = 1
  await typeChange(false)
  // 关闭下拉刷新
  uni.stopPullDownRefresh()
})
const searchPersonData = ref(null)

function debounce(func, wait) {
  let timeout
  return function (...args) {
    const context = this
    clearTimeout(timeout)
    timeout = setTimeout(() => func.apply(context, args), wait)
  }
}

let debounceSearch = debounce(async function () {
  console.log(searchPersonData.value)
  // let params = {
  //   pageNum:1,
  //   pageSize: 10000,
  //   nickName: searchPersonData.value,
  // }
  // let {code,rows} = await getDeptTree(params)
  // if(code === 200) {
  //   searchPerson.value = rows
  // }
}, 500)
const searchPerson = (v) => {
  searchPersonData.value = v
  // 掉搜索接口
  debounceSearch()
}
const getAttendanceApplyApiFn = async (userId) => {
  let params = {
    userId: userId,
  }
  let { code, data } = await getAttendanceApplyApi(params)
  if (code === 200) {
    frequency.value = data
  }
}
const getUserInfo = async () => {
  profile.value = (await getUserProfile()).data
}
onLoad(async () => {
  if (Number(props.id)) {
    index.value = Number(props.id)
  }
})
onShow(async () => {
  await typeChange()
  await getUserInfo()
  await getSelectApproveCountFn()
  await getAttendanceApplyApiFn(profile.value.userId)
  await getSelectApproveListFn()
})
</script>

<style lang="scss" scoped>
@import '@/static/style/index.scss';

body {
  background-color: $uni-bai;
  overflow: hidden;
}

.searchBar {
  height: 120rpx;
}

.segment {
  height: 56rpx;
  padding-bottom: 12rpx;
}

.topClass {
  background-color: #fff;
}

:deep(.uv-empty) {
  .uv-empty {
    z-index: 0 !important;
  }
}

.listTabbar {
  margin: 0 40rpx;
  padding-bottom: 20rpx;
  padding-top: 32rpx;
  box-sizing: border-box;

  h4 {
    margin-bottom: 32rpx;
  }

  .list-item {
    @include flex(center);
    padding: 20rpx 32rpx;
    background-color: #fff;
    border-radius: 16rpx;
    border: 1rpx solid #e5e6eb;
    margin-bottom: 16rpx;

    image {
      width: 40rpx;
      height: 40rpx;
    }

    .svg-image {
      margin-right: 16rpx;
      width: 72rpx;
      height: 72rpx;
      @include flex(center, center);
      border-radius: 12rpx;
    }

    .考勤image {
      background: #165dff;
    }

    .财务image {
      background: #ff7d00;
    }

    .人事image {
      background: #00b42a;
    }

    .行政image {
      background: #4954e6;
    }

    .其他image {
      background: #f54a45;
    }

    p {
      color: #1d2129;
      font-size: 32rpx;
      font-style: normal;
      font-weight: 400;
      line-height: 44.8rpx;
    }

    text {
      overflow: hidden;
      color: #86909c;
      text-overflow: ellipsis;
      font-size: 24rpx;
      font-style: normal;
      font-weight: 400;
    }
  }
}

:deep(.zb-dropdown-menu__bar) {
  height: 100% !important;
  box-shadow: none !important;
}

.dropDownItem {
  border: #e5e6eb 1px solid;
  border-radius: 44rpx;
  width: 335rpx;
  height: 64rpx;
}

:deep(.uni-searchbar__box) {
  justify-content: left;
}
</style>
